import FunctionalDemo from '@/views/FunctionalDemo.vue'

const routes = [
  {
    name: 'functionaldemo',
    path: '/',
    meta: { routeIntroduce: 'functionalDemo', icon: '' },
    component: FunctionalDemo
  },
  {
    name: 'reusedom',
    path: '/reusedom',
    meta: { routeIntroduce: 'reusedom', icon: '' },
    component: () =>
      import(/* webpackChunkName: "reusedom" */ '@/views/ReuseDom.vue')
  },
  {
    name: 'fordemo',
    path: '/fordemo',
    meta: { routeIntroduce: 'fordemo', icon: '' },
    component: () =>
      import(/* webpackChunkName: "fordemo" */ '@/views/ForDemo.vue')
  },
  {
    name: 'localvariables',
    path: '/localvariables',
    meta: { routeIntroduce: 'localvariables', icon: '' },
    component: () =>
      import(
        /* webpackChunkName: "localvariables" */ '@/views/LocalVariables.vue'
      )
  },
  {
    name: 'newslist',
    path: '/newslist',
    meta: { routeIntroduce: '新闻列表(懒加载)', icon: '' },
    component: () =>
      import(/* webpackChunkName: "newslist" */ '@/views/NewsList.vue')
  },
  {
    name: 'newslist2',
    path: '/newslist2',
    meta: { routeIntroduce: 'newslist2', icon: '' },
    component: () =>
      import(/* webpackChunkName: "newslist" */ '@/views/NewsList2.vue')
  },
  {
    name: 'permissiondemo',
    path: '/permissiondemo',
    meta: { routeIntroduce: '权限控制功能', icon: '' },
    component: () =>
      import(
        /* webpackChunkName: "permissiondemo" */ '@/views/PermissionDemo.vue'
      )
  },
  {
    name: '$set',
    path: '/$set',
    meta: { routeIntroduce: '$set的使用', icon: '' },
    component: () =>
      import(/* webpackChunkName: "$set" */ '@/views/$set_test/$set.vue')
  },
  {
    name: 'attrsListeners',
    path: '/attrsListeners',
    meta: { routeIntroduce: 'attrs&listenters', icon: '' },
    component: () =>
      import(
        /* webpackChunkName: "attrs&listenters" */ '@/views/vue面试/attrs&listenters.vue'
      )
  },
  {
    name: 'mixinTest',
    path: '/mixinTest',
    meta: { routeIntroduce: 'vue的mixin', icon: '' },
    component: () =>
      import(/* webpackChunkName: "mixinTest" */ '@/views/mixinTest/parentVue')
  },
  {
    name: 'nextTick',
    path: '/nextTick',
    meta: { routeIntroduce: 'vue的nextTick', icon: '' },
    component: () =>
      import(/* webpackChunkName: "nextTick" */ '@/views/$nextTick_test')
  },
  {
    name: 'refTest',
    path: '/ref',
    meta: { routeIntroduce: 'vue的$ref', icon: '' },
    component: () =>
      import(/* webpackChunkName: "nextTick" */ '@/views/$ref_test')
  },
  {
    name: 'slotTest',
    path: '/slotTest',
    meta: { routeIntroduce: 'vue的插槽', icon: '' },
    component: () =>
      import(/* webpackChunkName: "slotTest" */ '@/views/slotTest/index.vue')
  },
  {
    name: 'clearAryAndObj',
    path: '/clearAryAndObj',
    meta: { routeIntroduce: 'vue的空数组和对象', icon: '' },
    component: () =>
      import(
        /* webpackChunkName: "clearAryAndObj" */ '@/views/vue清空数组和对象/index.vue'
      )
  },
  {
    name: 'vueShengMing',
    path: '/vueShengMing',
    meta: { routeIntroduce: 'vue生命周期', icon: '' },
    component: () =>
      import(/* webpackChunkName: "vue生命" */ '@/views/生命周期')
  },

  {
    name: 'directiveTest',
    path: '/directiveTest',
    meta: { routeIntroduce: 'vue指令与自定义指令', icon: '' },
    component: () =>
      import(
        /* webpackChunkName: "directiveTest" */ '@/views/指令与自定义指令/index.vue'
      )
  },
  {
    name: 'someTest',
    path: '/testDemo',
    meta: { routeIntroduce: 'someTestDemo', icon: '' },
    component: () =>
      import(/* webpackChunkName: "testDemo" */ '@/views/testDemo')
  },
  {
    name: 'vueObservable',
    path: '/vueObservable',
    meta: { routeIntroduce: 'vue的Observable', icon: '' },
    component: () =>
      import(/* webpackChunkName: "vueObservable" */ '@/views/VueObservable')
  },
  {
    name: 'vueKey',
    path: '/vueKey',
    meta: { routeIntroduce: 'vue的key的作用', icon: '' },
    component: () =>
      import(/* webpackChunkName: "vueKey" */ '@/views/vue面试/key的作用.vue')
  },
  {
    name: 'vueProvideInject',
    path: '/vueProvideInject',
    // children: [
    //   {
    //     name: 'vueKey',
    //     path: '/vueProvideInject/vueKey1',
    //     meta: {},
    //     component: () =>
    //       import(
    //         /* webpackChunkName: "vueKey" */ '@/views/vue面试/key的作用.vue'
    //       )
    //   }
    // ],
    meta: { routeIntroduce: 'vue的ProvideInject', icon: '' },
    component: () =>
      import(
        /* webpackChunkName: "vueProvideInject" */ '@/views/vue面试/provide_inject'
      )
  },
  {
    name: 'GetComponentInstance',
    path: '/GetComponentInstance',
    meta: { routeIntroduce: '获取跨层级组件的DOM', icon: '' },
    component: () =>
      import(
        /* webpackChunkName: "GetComponentInstance" */ '@/views/vue面试/获取跨层级组件的实例'
      )
  },
  {
    name: 'vueComponentCommunication',
    path: '/vueComponentCommunication',
    meta: { routeIntroduce: '各组件通讯', icon: '' },
    component: () =>
      import(
        /* webpackChunkName: "vueComponentCommunication" */ '@/views/vue面试/各组件通讯'
      )
  },
  {
    name: 'DebounceAndThrottle',
    path: '/DebounceAndThrottle',
    meta: { routeIntroduce: 'vue防抖节流使用', icon: '' },
    component: () =>
      import(
        /* webpackChunkName: "DebounceAndThrottle" */ '@/views/vue面试/vue防抖节流使用'
      )
  },
  {
    name: 'vuex',
    path: '/vuexTest',
    meta: { routeIntroduce: 'vue的vuex', icon: '' },
    component: () =>
      import(/* webpackChunkName: "layoutIndex" */ '@/layout/index2.vue'),
    redirect: '/vuexTest/modules',
    children: [
      {
        path: '/vuexTest/modules',
        name: 'vuexModules',
        meta: { routeIntroduce: 'vuex的modules模块使用', icon: '' },
        component: () =>
          import(
            /* webpackChunkName: "vuexModules" */ '@/views/vuex_test/modules模块属性test.vue'
          )
      },
      {
        path: '/vuexTest/modules2222',
        name: 'vuexModules222',
        meta: { routeIntroduce: '嵌套测试1', icon: '' },
        component: () =>
          import(
            /* webpackChunkName: "vuexModules" */ '@/views/vuex_test/modules模块属性test.vue'
          ),
        children: [
          {
            path: '/vuexTest/modules2222/modules3333',
            name: 'vuexModules3333',
            meta: { routeIntroduce: '嵌套测试2', icon: '' },
            component: () =>
              import(
                /* webpackChunkName: "vuexModules" */ '@/views/vuex_test/modules模块属性test.vue'
              )
          }
        ]
      }
    ]
  },
  {
    path: '*',
    redirect: '/'
  }
]

export default routes
